<#import "../tpl/pageTep.ftl" as page>
<@page.pageBase currentMenu="佣金管理">
<style>
    .form-horizontal .controls { line-height: 40px;height:40px;}
    .form-horizontal .time-label {width: 80px;  }
    .form-panel .time-input{width: 70px;}
    .span5{width: 186px;}
    .form-horizontal .money-label {width: 60px;}
     .money-span5{width:166px;}
    .money-p p{margin: 0 0 0 10px;padding:0;height:24px;line-height: 24px;font-size: 12px}
    .money-p div{float: left;}
    .money-p span{color: #6cb5f4;}
    .form-horizontal .rate-label{width: 120px;}
</style>
<form id="searchForm" class="form-panel">
    <ul class="panel-content">
        <li class="money-p">
            <div><p>佣金分配比例：商品利润的<span>20</span>%作为佣金。</p>

                <p>佣金分配比例：A级机构<span>20</span> %，B级机构<span>20</span> %，C级机构<span>20</span> %，志愿者<span>20</span> %。1元佣金等于<span>20</span>个爱心豆。</p>
            </div>
            <a class="query-button button button-primary" href="javascript:add()" style="margin-left: 10px">
               设置
            </a>
        </li>
        <hr/>
        <li>
            <div class="control-group span5">
                <div class="search-controls  controls">
                    <input type="text" name="title" id="title" value="" placeholder="搜索关键字">
                </div>
            </div>
            <div class="form-actions span2">
                <button type="submit" class="button  button-primary">
                    搜索
                </button>
            </div>
            <div class="form-actions span5">
                <label class="time-label control-label">爱心豆总数：</label>
                <div class="controls">
                    <input type="text" value="" class="time-input input-normal" disabled/>
                </div>
            </div>
            <div class="money-span5 form-actions span5">
                <label class="money-label control-label">已提现：</label>
                <div class="controls">
                    <input type="text" value="" class="time-input input-normal" disabled/>
                </div>
            </div>
            <div class="money-span5 form-actions span5">
                <label class="money-label control-label">未提现：</label>
                <div class="controls">
                    <input type="text" value="" class="time-input input-normal" disabled/>
                </div>
            </div>
        </li>
    </ul>
</form>
<div id="grid"></div>
<#------------------------------------------------------编辑表单start------------------------------------------------------->
<div id="addContent" style="display:none;">
    <form id="addForm" class="form-horizontal" >
        <div class="row">
            <div class="control-group span16">
                <label class="rate-label control-label">佣金占比润：</label>

                <div class="controls">
                    <input type="text" class="input-normal control-text" name="name" data-rules="{required : true}">%
                </div>
            </div>
            <div class="control-group span16">
                <label class="rate-label control-label">A级获得佣金占比：</label>

                <div class="controls">
                    <input type="text" class="input-normal control-text" name="name" data-rules="{required : true}">%
                </div>
            </div>
            <div class="control-group span16">
                <label class="rate-label control-label">B级获得佣金占比：</label>

                <div class="controls">
                    <input type="text" class="input-normal control-text" name="name" data-rules="{required : true}">%
                </div>
            </div>
            <div class="control-group span16">
                <label class="rate-label control-label">C级获得佣金占比：</label>

                <div class="controls">
                    <input type="text" class="input-normal control-text" name="name" data-rules="{required : true}">%
                </div>
            </div>
            <div class="control-group span16">
                <label class="rate-label  control-label">志愿者获得佣金占比：</label>

                <div class="controls">
                    <input type="text" class="input-normal control-text" name="name" data-rules="{required : true}">%
                </div>
            </div>
            <div class="control-group span16">
                <label class="rate-label control-label">1元佣金=</label>

                <div class="controls">
                    <input type="text" class="input-normal control-text" name="name" data-rules="{required : true}">个爱心豆
                </div>
            </div>
        </div>
    </form>
</div>
<#------------------------------------------------------编辑表单end------------------------------------------------------->
<script>
    /*-------------------------------------------------------- 表格数据渲染start-----------------------------------*/
    var Grid = BUI.Grid,
            Store = BUI.Data.Store,
            columns = [
                {title: '机构名称', dataIndex: ''},
                {title: '机构等级', dataIndex: ''},
                {title: '爱心豆总数', dataIndex: ''},
                {title: '已提现', dataIndex: ''},
                {title: '未提现', dataIndex: ''}
            ];
    var store = new Store({
                url: 'loadData',
                autoLoad: true, //自动加载数据
                params: { //配置初始请求的参数
                    length: '10',
                    status: $("#phone").val()
                },
                pageSize: 10,	// 配置分页数目
                root: 'list',
                totalProperty: 'total'
            }),
            grid = new Grid.Grid({
                render: '#grid',
                columns: columns,
                loadMask: true, //加载数据时显示屏蔽层
                store: store,
                plugins: [Grid.Plugins.CheckSelection], // 插件形式引入多选表格

                // 底部工具栏
                bbar: {
                    pagingBar: true
                }
            });
    grid.render();

    var form = new BUI.Form.HForm({
        srcNode: '#searchForm'
    }).render();

    form.on('beforesubmit', function (ev) {
        //序列化成对象
        var obj = form.serializeToObject();
        obj.start = 0; //返回第一页
        store.load(obj);
        return false;
    });

    /*-------------------------------------------------------- 表格数据渲染end-----------------------------------*/
    /*----------------------------------------------编辑表单处理 begin------------------------------------*/
    var Select = BUI.Select, Data = BUI.Data;
    var addForm = new BUI.Form.Form({
        srcNode: '#addForm',
        submitType: 'ajax',
        callback: function (data) {
            addDialog.close();
        }
    }).render();

    var addDialog = new BUI.Overlay.Dialog({
        title: '佣金设置',
        width: 400,
        height: 350,
        contentId: 'addContent',
        success: function () {
        }
    });
    //添加按钮事件
    function add() {
        addDialog.show();
    }
        /*----------------------------------------------编辑表单处理 end------------------------------------*/

</script>

</@page.pageBase>